<style>

</style>
<template>
  <span>
    <!-- DIALOG 模式 -->
    <el-button type="text" size="mini" @click="toShow">日志</el-button>

    <el-dialog
      append-to-body
      :close-on-click-modal="true"
      :close-on-press-escape="true"
      :show-close="true"
      title="操作日志"
      :visible.sync="dialogVisible"
      width="60%">
      <el-table
        :header-cell-style="{background:'#eef1f6',color:'#606266'}"
        :data="pageResult.data"
        border
        :default-sort="{prop: 'createTime', order: 'descending'}"
        style="width: 100%; margin-top: 20px;font-size: 10px">
        <el-table-column
          align="center"
          prop="module"
          label="模块">
        </el-table-column>
        <el-table-column
          align="center"
          prop="operatorType"
          label="操作类型">
        </el-table-column>
        <el-table-column
          prop="content"
          align="center"
          label="操作内容">
           <template slot-scope="scope">
            {{ scope.row.content }}
           </template>
        </el-table-column>
        <el-table-column
          sortable
          align="center"
          width="150"
          label="操作时间">
          <template slot-scope="scope">
            {{ recDateFormat(scope.row.createTime) }}
          </template>
        </el-table-column>
      </el-table>
      <el-footer>
        <vue-page :paginator="pageResult.paginator" :query="query"></vue-page>
      </el-footer>
    </el-dialog>
  </span>
</template>
<script>

import vuePage from "../common/vue-page.vue"
import {logPageQuery} from "../../api/logApi";


export default {
  name: "vue-log",
  props: ["module", "targetId"],
  components: {
    vuePage
  },
  data() {
    return {
      dialogVisible: false,
      // 查询返回结果
      pageResult: {
        data: [],
        paginator: {
          currentPage: 0,
          totalCount: 0,
          pageSize: 10,
          totalPage: 0
        }
      },
    }
  },
  computed: {},
  created() {
  },
  methods: {
    async query() {
      let vm = this
      let req = {
        'module': vm.module,
        'targetId': vm.targetId,
      }

      let ret = await logPageQuery(req, vm.pageResult.paginator)
      if (ret.ok) {
        vm.pageResult = ret.data.queryPage
      } else {
        vm.$message({type: 'error', message: '日志查询失败：' + ret.message});
      }
    },
    async toShow() {
      await this.query()

      this.dialogVisible = true
    },
    clearForm() {
      this.dialogVisible = false
    },
  }
}
</script>
